﻿<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS属性list-style-type的应用</title>
<style>
div{
	border:1px solid;
	width:235px;
	height:125px;
	float:left;
	margin:5px;
}
.none{ list-style-type: none}
.disc{ list-style-type: disc}
.circle{ list-style-type:circle}
.square{ list-style-type: square}
.decimal{ list-style-type: decimal}
.decimal-leading-zero{ list-style-type:decimal-leading-zero}
.upper-roman{ list-style-type: upper-roman}
.lower-roman{ list-style-type: lower-roman}
.upper-alpha{ list-style-type:upper-alpha}
.lower-alpha{ list-style-type: lower-alpha}
.upper-latin{ list-style-type:upper-latin}
.lower-latin{ list-style-type: lower-latin}
.lower-greek{ list-style-type: lower-greek}
.hebrew{ list-style-type: hebrew}
.armenian{ list-style-type: armenian}
.georgian{ list-style-type: georgian}
.cjk-ideographic{ list-style-type: cjk-ideographic}
.hiragana{ list-style-type: hiragana}
.hiragana-iroha{ list-style-type: hiragana-iroha}
.katakana{ list-style-type: katakana}
.katakana-iroha{ list-style-type: katakana-iroha}
</style>
</head>
<body>
<h3>CSS属性list-style-type的应用</h3>
<hr />
<div>
<h4>属性值为none</h4>
<ul class="none">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为disc</h4>
<ul class="disc">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为circle</h4>
<ul class="circle">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为square</h4>
<ul class="square">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为decimal</h4>
<ul class="decimal">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为decimal-leading-zero</h4>
<ul class="decimal-leading-zero">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为upper-roman</h4>
<ul class="upper-roman">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为lower-roman</h4>
<ul class="lower-roman">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为upper-alpha</h4>
<ul class="upper-alpha">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为lower-alpha</h4>
<ul class="lower-alpha">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为upper-latin</h4>
<ul class="upper-latin">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为lower-latin</h4>
<ul class="lower-latin">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为lower-greek</h4>
<ul class="lower-greek">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为hebrew</h4>
<ul class="hebrew">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为armenian</h4>
<ul class="armenian">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为georgian</h4>
<ul class="georgiann">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为cjk-ideographic</h4>
<ul class="cjk-ideographic">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为hiragana</h4>
<ul class="hiragana">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为katakana</h4>
<ul class="katakana">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为hiragana-irohaic</h4>
<ul class="hiragana-iroha">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>

<div>
<h4>属性值为katakana-iroha</h4>
<ul class="katakana-iroha">
<li>跳水</li>
<li>举重</li>
<li>击剑</li>
</ul>
</div>
</body>
</html>